inline-block 间隙根本原因

元素被当成行内元素排版的时候, 根据white-space的处理方式（默认是normal，合并多余空白），原来HTML代码中的回车换行被转成一个空白符，元素之间的空白符（空格、回车换行等）都会被浏览器处理，在字体不为0的情况下，空白符占据一定宽度，所以inline-block的元素之间就出现了空隙，这些元素之间的间距会随着字体的大小而变化，当行内元素font-size:16px时，间距为8px。
img标签默认是display：inline-block属性，

解决方法

元素写在一行，不换行，可读性差
父元素设置 font-size = 0, 子元素在设置 font-size; 子元素如果里面有文字，文字会消失不见
设置浮动 float: left; 高度坍塌，要清除浮动
父元素设置：display:table;word-spacing:-1em;

word-spacing

如何处理元素中的空白